@charset "utf-8";
pre {
	width: 340px;
	margin: 0 auto;
	border: dashed 1px #aaa;
	margin-bottom: 10px;
}
/*.gallery:after {
    content: '';
    display: block;
    height: 2px;
    margin: .5em 0 1.4em;
    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(77,77,77,1) 50%, rgba(0, 0, 0, 0) 100%);
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(77,77,77,1) 50%, rgba(0, 0, 0, 0) 100%);
}
*/
.product   {   height: 876px; margin: 0 auto;}
.product ul { padding: 40px 0 0 20px;}
.product img {	width: 500px;	height: 379px; border-radius: 25px;  }
 
 .img111 img{ width: 98%; padding-top: 10px; height:271px;  cursor: pointer;transition: all 0.5s; }
 .img111  img:hover{ transform: scale(1.03);   transition: all 0.5s;  }



.product li{	float: left;	margin-right: 20px; 	margin-bottom: 40px; border: 1px solid #ccc; border-top-left-radius: 25px;border-top-right-radius: 25px;}
.product li:nth-child(3n+3){	margin-right: 0;}
.product a {	display: block;	width: 500px;	height: 379px;	overflow: hidden;	position: relative;}
.product a:hover {	box-shadow: 0 0 8px -1px #333;  border-top-left-radius: 25px;border-top-right-radius: 25px;}
 
 


.product li:hover {border-top-left-radius: 25px;border-top-right-radius: 25px;}
.product li div{
	position: absolute; 
	left: 0;	right: 0;  bottom: 0;	text-align: center;	
	background: rgba(255,255,255,1);	
	font-size: 18px;	color: #333;	
	z-index: 3;	line-height: 50px;
}


 




.product li div p{ padding:0 5px;	overflow: hidden;  ;
display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;	text-align: center;}

.product li i{	position: absolute;	left: 0;	top: 0;	right: 0;
	bottom: 0;	background-color: rgba(0,91,172,0.5);
	z-index: 1;	opacity: 0;	transition: all 0.3s;	border:1px #f2f2f2;	
}
.product a:hover i{	opacity: 1.0;}
.product a:hover div{	color: #e60013}









.hljs-comment {
	color: #969896
}
.hljs-tag {
	color: #f8f8f2
}
.css .hljs-class, .css .hljs-id, .css .hljs-pseudo, .hljs-attribute, .hljs-regexp, .hljs-title, .hljs-variable, .html .hljs-doctype, .ruby .hljs-constant, .xml .hljs-doctype, .xml .hljs-pi, .xml .hljs-tag .hljs-title {
	color: #c66
}
.hljs-built_in, .hljs-constant, .hljs-literal, .hljs-number, .hljs-params, .hljs-pragma, .hljs-preprocessor {
	color: #de935f
}
.css .hljs-rules .hljs-attribute, .ruby .hljs-class .hljs-title {
	color: #f0c674
}
.hljs-header, .hljs-inheritance, .hljs-string, .hljs-value, .ruby .hljs-symbol, .xml .hljs-cdata {
	color: #b5bd68
}
.css .hljs-hexcolor {
	color: #8abeb7
}
.coffeescript .hljs-title, .hljs-function, .javascript .hljs-title, .perl .hljs-sub, .python .hljs-decorator, .python .hljs-title, .ruby .hljs-function .hljs-title, .ruby .hljs-title .hljs-keyword {
	color: #81a2be
}
.hljs-keyword, .javascript .hljs-function {
	color: #b294bb
}
.hljs {
	display: block;
	overflow-x: auto;
	background: #35383C;
	color: #c5c8c6;
	padding: .8em
}
.coffeescript .javascript, .javascript .xml, .tex .hljs-formula, .xml .css, .xml .hljs-cdata, .xml .javascript, .xml .vbscript {
	opacity: .5
}